export const DLTable = defineComponent({
  setup(props, {slots}) {
    return () => <table class='table-auto'>{slots.default?.()}</table>
  }
})

export const DLTbody = defineComponent({
  setup(props, {slots}) {
    return () => <tbody>{slots.default?.()}</tbody>
  }
})

export const DLTr = defineComponent({
  setup(props, {slots}) {
    return () => <tr class='min-h-32 flex items-center mb-15'>{slots.default?.()}</tr>
  }
})

export const DLLabel = defineComponent({
  setup(props, {slots}) {
    return () => <td class='pl-8 mr-8'>{slots.default?.()}</td>
  }
})
export const DLValue = defineComponent({
  setup(props, {slots}) {
    return () => <td class='flex flex-nowrap items-center gap-x-16'>{slots.default?.()}</td>
  }
})
export const DLUnit = defineComponent({
  setup(props, {slots}) {
    return () => <td class=''>{slots.default?.()}</td>
  }
})
